// Styles relating to how elements should be styled when focused.
// Resets aside, these should not change geometry.

// In Gecko, these additional attributes are added to buttons and certain inputs, which causes
// button sizes to be different in Gecko than other engines.
button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

%custom-focus-ring {
  outline: $focus-outline-color solid 1px;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.075), 0 0 5px $half-focus-outline-color;
}

a:focus, button:focus, input:focus, select:focus, textarea:focus {
  @extend %custom-focus-ring;
}
